YUI.add('projectulview', function (Y) {
	Y.namespace('AppView');
	Y.AppView.ProjectUlView = Y.Base.create('projectUlView', Y.View, [], {
	    // This is where we attach DOM events for the view. The `events` object is a
	    // mapping of selectors to an object containing one or more events to attach
	    // to the node(s) matching each selector.
	    events: {
	        // Add and remove hover states on project items.
	        '.project-item': {
	            mouseover: 'hoverOn',
	            mouseout : 'hoverOff'
	        }
	    },
	
	    // The `template` property is a convenience property for holding a
	    // template for this view. In this case, we'll use it to store the
	    // contents of the #project-stats-template element, which will serve as the
	    // template for the statistics displayed at the bottom of the list.
	    template: '',
	
	    // The initializer runs when a ProjectAppView instance is created, and gives
	    // us an opportunity to set up the view.
	    initializer: function () {
	        // Create a new ProjectList instance to hold the Project items.
	        var list = this.projectList = new Y.AppModel.ProjectList();
	        Y.projectListList[this.get('parentId')] = list;
	        
	        list.comparator = function (model) {
	            return model.get('position');
	        };
	        list.after('add', this.add, this);
	        list.after('reset', this.reset, this);

//	        list.after(['add','reset', 'remove', 'projectModel:completedChange'],
//	                this.render, this);
	        list.load({parentId:this.get('parentId')});
	    },
	
	    render: function () {
	    	var container = this.get('container');
	    	container.set('id','ul--' + (this.get('parentId') ? this.get('parentId') : Y.rootEntry));
	        return this;
	    },
	
	    // -- Event Handlers -------------------------------------------------------
	    add: function (e) {
	    	
	    	var model = e.model;
//	    	Y.log(model.toJSON());
	        var view = new Y.AppView.ProjectLiView({model: model});
	        var liNode =   view.render().get('container');
	        
	        var nextModel = this.projectList.next(model);
	        if(nextModel){//有下一个邻居
	        	var relationLi = Y.Wfutils.getNode('li',nextModel);
	        	if(relationLi){
	        		relationLi.insert(liNode,'before');
	        	}
	        }else{
	        	var preModel = this.projectList.previous(model);
	        	if(preModel){//有前一个邻居
		        	var relationLi = Y.Wfutils.getNode('li',preModel);
		        	if(relationLi){
		        		relationLi.insert(liNode,'after');
		        	}
	        	}else{
	        		this.get('container').append(liNode);
	        	}
	        }
	        Y.Wfutils.focusEditingProject(liNode,"start");
	    },
	    
		reset: function (e) {
		  var fragment = Y.one(Y.config.doc.createDocumentFragment());
		  Y.Array.each(e.models, function (model) {
		      var view = new Y.AppView.ProjectLiView({model: model});
		      fragment.append(view.render().get('container'));
		  });
		
		  	this.get('container').setContent(fragment);
		},
	    // Turns off the hover state on a project item.
	    hoverOff: function (e) {
	        e.currentTarget.removeClass('project-hover');
	    },
	    // Turns on the hover state on a project item.
	    hoverOn: function (e) {
	        e.currentTarget.addClass('project-hover');
	    }
	}, {
	    ATTRS: {
	        container: {
	            valueFn: function () {
	                return Y.Node.create('<ul class="project-ul"></ul>');
	            }
	        },
	        parentId: {
	            setter: function (val) {
	                return val;
	            }
	        }
	    }
	});
},'0.0.1',{requires:['node','base','event','view','model', 'model-list']});